<template>
  <div class="edit_box">
    <van-nav-bar title="修改登录密码" left-arrow @click-left="onClickLeft" />
    <div class="logo"><img src="../../images/edit_logo.jpeg" alt=""></div>
    <div class="formBox">
        <van-field
        v-model="password"
        type="password"
        label="旧密码"
        placeholder="请输入旧密码"
      />
      <van-field
        v-model="newPassword"
        type="newPassword"
        label="新密码"
        placeholder="请输入新密码"
      />
      <van-button round type="info" color="#f5222d" block @click="updateEvt">确认修改</van-button>
    </div>
  </div>
</template>
<script>
import { updateApi } from "../../apis/updateApi";
export default {
  data() {
    return {
      password:"",
      newPassword:"",
      token:"",
      pwd:""
    };
  },
  computed: {
      userPwd() {
      return this.$store.getters["common/user"];
    },
    userToken() {
      return this.$store.getters["common/token"];
    },
  },
  created(){
    this.token=this.userToken
    this.pwd =this.userPwd.password
    console.log(this.token);
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    updateEvt() {
        if(this.password!=this.pwd){
             this.$toast({
              message:"旧密码错误",
              position: "bottom",
            });
        }else{
          updateApi(this.password,this.newPassword).then((res) => {
          if (res.code == 200) {
            this.$toast({
              message:"密码修改成功",
              position: "bottom",
            });
            this.$store.commit('common/mutationToken','')
            this.$store.commit('common/mutationUser','')
            this.$router.push("/login");
          }
        }).catch(err=>{
            this.$toast({
              message: err,
              position: "bottom",
            });
        });
        }
    },
    },
  }
</script>
<style lang="less" scoped>
@import "../../style/index.less";
.logo{
  margin: auto;
  margin-top: 20px;
  width: 100px;
  height: 100px;
  img{
    width: 100%;
    height: 100%;
    border-radius: 100%;
  }
}
.edit_box {
  color: #d9d9d9;
  width: 100%;
  height: 100%;
}
.formBox {
  margin: auto;
  width: 100%;
  height: 100%;
}
.van-nav-bar {
  margin-bottom: 20px;
}

.van-button--block {
  margin-top: 40px;
}
body > div {
  height: 100%;
}
</style>